<template name="skeleton">
  <view class="sk-container">
    <view is="pages/index/components/CustomNavbar" class="data-v-83a5a03c data-v-83a5a03c">
      <view
        class="navbar CustomNavbar--navbar data-v-ff0d84a2 CustomNavbar--data-v-ff0d84a2"
        style="padding-top: 44px"
      >
        <view class="logo CustomNavbar--logo data-v-ff0d84a2 CustomNavbar--data-v-ff0d84a2">
          <image
            class="logo-image CustomNavbar--logo-image data-v-ff0d84a2 CustomNavbar--data-v-ff0d84a2 sk-image"
          ></image>
          <text
            class="logo-text CustomNavbar--logo-text data-v-ff0d84a2 CustomNavbar--data-v-ff0d84a2 sk-transparent sk-text-3-5714-314 sk-text"
            >新鲜 · 亲民 · 便捷</text
          >
        </view>
        <view class="search CustomNavbar--search data-v-ff0d84a2 CustomNavbar--data-v-ff0d84a2">
          <text
            class="icon-search CustomNavbar--icon-search data-v-ff0d84a2 CustomNavbar--data-v-ff0d84a2 sk-transparent sk-text-14-2857-818 sk-text sk-pseudo sk-pseudo-circle"
            >搜索商品</text
          >
          <text
            class="icon-scan CustomNavbar--icon-scan data-v-ff0d84a2 CustomNavbar--data-v-ff0d84a2 sk-pseudo sk-pseudo-circle"
          ></text>
        </view>
      </view>
    </view>
    <scroll-view
      :enable-flex="true"
      :refresher-enabled="true"
      :scroll-y="true"
      class="main main data-v-83a5a03c data-v-83a5a03c"
      lower-threshold="10"
      :enable-back-to-top="true"
    >
      <view is="components/XtxBanner" class="data-v-83a5a03c data-v-83a5a03c">
        <view class="carousel XtxBanner--carousel data-v-8e193a37 XtxBanner--data-v-8e193a37">
          <swiper
            class="swiper XtxBanner--swiper data-v-8e193a37 XtxBanner--data-v-8e193a37"
            :current="0"
            :autoplay="false"
          >
            <swiper-item
              class="data-v-8e193a37 XtxBanner--data-v-8e193a37"
              data-index="2"
              style="
                position: absolute;
                width: 100%;
                height: 100%;
                transform: translate(0%, 0px) translateZ(0px);
              "
            >
              <navigator
                class="navigator XtxBanner--navigator data-v-8e193a37 XtxBanner--data-v-8e193a37"
                hover-class="none"
              >
                <image
                  class="image XtxBanner--image data-v-8e193a37 XtxBanner--data-v-8e193a37 sk-image"
                  mode="aspectFill"
                ></image>
              </navigator>
            </swiper-item>
          </swiper>
          <view class="indicator XtxBanner--indicator data-v-8e193a37 XtxBanner--data-v-8e193a37">
            <text class="dot XtxBanner--dot data-v-8e193a37 XtxBanner--data-v-8e193a37"></text>
            <text class="dot XtxBanner--dot data-v-8e193a37 XtxBanner--data-v-8e193a37"></text>
            <text class="dot XtxBanner--dot data-v-8e193a37 XtxBanner--data-v-8e193a37"></text>
            <text
              class="dot XtxBanner--dot data-v-8e193a37 XtxBanner--data-v-8e193a37 active XtxBanner--active"
            ></text>
            <text class="dot XtxBanner--dot data-v-8e193a37 XtxBanner--data-v-8e193a37"></text>
          </view>
        </view>
      </view>
      <view is="pages/index/components/CategoryPanel" class="data-v-83a5a03c data-v-83a5a03c">
        <scroll-view
          :enable-flex="true"
          :scroll-y="true"
          class="category-panel CategoryPanel--category-panel data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
        >
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-673 sk-text"
              >居家</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-285 sk-text"
              >锦鲤</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-272 sk-text"
              >服饰</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-64 sk-text"
              >母婴</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-522 sk-text"
              >个护</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-766 sk-text"
              >严选</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-343 sk-text"
              >数码</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-214 sk-text"
              >运动</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-128 sk-text"
              >杂项</text
            >
          </view>
          <view
            class="item-box CategoryPanel--item-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
          >
            <view
              class="image-box CategoryPanel--image-box data-v-44ae5a81 CategoryPanel--data-v-44ae5a81"
            >
              <image
                class="image CategoryPanel--image data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-image"
              ></image>
            </view>
            <text
              class="name CategoryPanel--name data-v-44ae5a81 CategoryPanel--data-v-44ae5a81 sk-transparent sk-text-20-0000-211 sk-text"
              >品牌</text
            >
          </view>
        </scroll-view>
      </view>
      <view is="pages/index/components/HotPanel" class="data-v-83a5a03c data-v-83a5a03c">
        <view class="hot-panel HotPanel--hot-panel data-v-df6c854a HotPanel--data-v-df6c854a">
          <view class="item HotPanel--item data-v-df6c854a HotPanel--data-v-df6c854a">
            <view class="title HotPanel--title data-v-df6c854a HotPanel--data-v-df6c854a">
              <view
                class="title-name HotPanel--title-name data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-27-5000-833 sk-text"
                >特惠推荐</view
              >
              <view
                class="title-alt HotPanel--title-alt data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-35-0000-752 sk-text"
                >精选全攻略</view
              >
            </view>
            <navigator
              class="images-box HotPanel--images-box data-v-df6c854a HotPanel--data-v-df6c854a"
              hover-class="none"
            >
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
            </navigator>
          </view>
          <view class="item HotPanel--item data-v-df6c854a HotPanel--data-v-df6c854a">
            <view class="title HotPanel--title data-v-df6c854a HotPanel--data-v-df6c854a">
              <view
                class="title-name HotPanel--title-name data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-27-5000-179 sk-text"
                >爆款推荐</view
              >
              <view
                class="title-alt HotPanel--title-alt data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-35-0000-536 sk-text"
                >最受欢迎</view
              >
            </view>
            <navigator
              class="images-box HotPanel--images-box data-v-df6c854a HotPanel--data-v-df6c854a"
              hover-class="none"
            >
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
            </navigator>
          </view>
          <view class="item HotPanel--item data-v-df6c854a HotPanel--data-v-df6c854a">
            <view class="title HotPanel--title data-v-df6c854a HotPanel--data-v-df6c854a">
              <view
                class="title-name HotPanel--title-name data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-27-5000-626 sk-text"
                >一站买全</view
              >
              <view
                class="title-alt HotPanel--title-alt data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-35-0000-572 sk-text"
                >精心优选</view
              >
            </view>
            <navigator
              class="images-box HotPanel--images-box data-v-df6c854a HotPanel--data-v-df6c854a"
              hover-class="none"
            >
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
            </navigator>
          </view>
          <view class="item HotPanel--item data-v-df6c854a HotPanel--data-v-df6c854a">
            <view class="title HotPanel--title data-v-df6c854a HotPanel--data-v-df6c854a">
              <view
                class="title-name HotPanel--title-name data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-27-5000-859 sk-text"
                >新鲜好物</view
              >
              <view
                class="title-alt HotPanel--title-alt data-v-df6c854a HotPanel--data-v-df6c854a sk-transparent sk-text-35-0000-280 sk-text"
                >生活加分项</view
              >
            </view>
            <navigator
              class="images-box HotPanel--images-box data-v-df6c854a HotPanel--data-v-df6c854a"
              hover-class="none"
            >
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
              <image
                class="image HotPanel--image data-v-df6c854a HotPanel--data-v-df6c854a sk-image"
                mode="aspectFill"
              ></image>
            </navigator>
          </view>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<style lang="scss" scoped>
@import '../styles/CategoryPanel', '../styles/CategoryPanel', '../styles/HotPanel';

.sk-transparent {
  color: transparent !important;
}
.sk-text-3-5714-314 {
  background-image: linear-gradient(
    transparent 3.5714%,
    #eeeeee 0%,
    #eeeeee 96.4286%,
    transparent 0%
  ) !important;
  background-size: 100% 28rpx;
  position: relative !important;
}
.sk-text {
  background-origin: content-box !important;
  background-clip: content-box !important;
  background-color: transparent !important;
  color: transparent !important;
  background-repeat: repeat-y !important;
}
.sk-text-14-2857-818 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 39.2rpx;
  position: relative !important;
}
.sk-text-20-0000-673 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-285 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-272 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-64 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-522 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-766 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-343 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-214 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-128 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-20-0000-211 {
  background-image: linear-gradient(
    transparent 20%,
    #eeeeee 0%,
    #eeeeee 80%,
    transparent 0%
  ) !important;
  background-size: 100% 40rpx;
  position: relative !important;
}
.sk-text-27-5000-833 {
  background-image: linear-gradient(
    transparent 27.5%,
    #eeeeee 0%,
    #eeeeee 72.5%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-text-35-0000-752 {
  background-image: linear-gradient(
    transparent 35%,
    #eeeeee 0%,
    #eeeeee 65%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-text-27-5000-179 {
  background-image: linear-gradient(
    transparent 27.5%,
    #eeeeee 0%,
    #eeeeee 72.5%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-text-35-0000-536 {
  background-image: linear-gradient(
    transparent 35%,
    #eeeeee 0%,
    #eeeeee 65%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-text-27-5000-626 {
  background-image: linear-gradient(
    transparent 27.5%,
    #eeeeee 0%,
    #eeeeee 72.5%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-text-35-0000-572 {
  background-image: linear-gradient(
    transparent 35%,
    #eeeeee 0%,
    #eeeeee 65%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-text-27-5000-859 {
  background-image: linear-gradient(
    transparent 27.5%,
    #eeeeee 0%,
    #eeeeee 72.5%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-text-35-0000-280 {
  background-image: linear-gradient(
    transparent 35%,
    #eeeeee 0%,
    #eeeeee 65%,
    transparent 0%
  ) !important;
  background-size: 100% 80rpx;
  position: relative !important;
}
.sk-image {
  background: #efefef !important;
}
.sk-pseudo::before,
.sk-pseudo::after {
  background: #efefef !important;
  background-image: none !important;
  color: transparent !important;
  border-color: transparent !important;
}
.sk-pseudo-rect::before,
.sk-pseudo-rect::after {
  border-radius: 0 !important;
}
.sk-pseudo-circle::before,
.sk-pseudo-circle::after {
  border-radius: 50% !important;
}
.sk-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: transparent;
}
</style>
